<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>Hello APP</title>
    <link rel="stylesheet" type="text/css" href="./css/api.css" />
    <link rel="stylesheet" type="text/css" href="./css/app.css" />
    <link rel="stylesheet" type="text/css" href="./css/iconfont.css">
    <style type="text/css">
    html,body{
        height: 100%;
    }
    
    #footer{ position: fixed;bottom: 0px;height: 50px;}
    
    .header-active{display:block;}
    header{display:none;}
    
    </style>
</head>
<body>
	<header style="background-image: linear-gradient(160deg, #b100ff 20%,#00b3ff 80%);" class="H-header   header-active" id="index">
        <div class="H-header-title H-flexbox-horizontal H-vertical-middle H-font-size-18 H-text-show-row-1 H-theme-font-color-white H-position-absolute H-width-100-percent">
           
            <div  onclick="$app.openWinByUrl('win_head','html/win_head',{'frame':'search_body' ,'furl':'search_body','title':'搜索'})" class="H-header-search H-flex-item H-margin-horizontal-both-10 H-padding-horizontal-both-10 H-position-relative  H-theme-background-color-eee H-border-radius-5 H-line-height-normal">
                <span class="H-icon H-display-block H-position-absolute H-float-left H-z-index-10 H-vertical-middle" style="height: 100% !important;"><i class="H-iconfont H-icon-search H-font-size-16 H-theme-font-color-ccc"></i></span>
                <form action="" id="search">
                	<input readonly="" type="text" id="keyword" name="keyword" placeholder="请输入关键字..." id="H-header-search-text" class="H-width-100-percent H-box-sizing-border-box H-border-none H-padding-horizontal-both-10 H-font-size-14 H-padding-vertical-both-8 H-theme-background-color-transparent H-theme-font-color3 H-padding-horizontal-left-25 H-vertical-middle">
                	
                </form>
                
            </div>
        </div>
    </header>
    
    
    <header class="H-header H-theme-background-color-white " id="music">
        <!--<span  class="H-icon H-position-relative H-display-inline-block H-float-left H-vertical-middle H-theme-font-color-666 H-padding-horizontal-left-8 H-z-index-100">
        	<i class="H-iconfont icon-xiangzuo1 H-font-size-22 H-vertical-middle"></i>
        </span>-->
        <div class=" H-header-title  H-center-all H-horizontal-left  H-font-size-18 H-text-show-row-1 H-theme-font-color-333 H-position-absolute H-width-100-percent">音乐</div>
    </header>
    

    <header class="H-header H-theme-background-color-497bf0" id="user">
        <!--<span onclick="message();" class="H-padding-horizontal-both-10 H-icon H-position-relative H-display-inline-block H-float-left H-vertical-middle H-theme-font-color-333 H-padding-horizontal-right-5 H-z-index-100">
    		<i class="H-iconfont icon-xinxi H-font-size-18 H-vertical-middle"></i>
	    	<span class="msg H-badge H-display-inline-block H-badge-null H-theme-background-color7 H-border-radius-circle H-position-absolute H-z-index-10000" style="top:10px;right:5px;"></span>
	    </span>-->
    
        <div class=" H-header-title H-center-all  H-horizontal-left  H-font-size-18 H-text-show-row-1 H-theme-font-color-333 H-position-absolute H-width-100-percent">我的</div>
        <span onclick="setting();" class="H-padding-horizontal-both-10 H-icon H-position-relative H-display-inline-block H-float-right H-vertical-middle H-theme-font-color-333 H-padding-horizontal-right-5 H-z-index-100">
    		<i class="H-iconfont H-icon-setting H-font-size-18 H-vertical-middle"></i>
    	</span>
    </header>
   <!--<iframe src="http://qmyouku.duapp.com/player.php?url=http://www.iqiyi.com/v_19rrbn42i0.html"></iframe>-->
    <footer class="H-footer H-flexbox-horizontal H-theme-background-color-white H-border-vertical-top-after" id="footer">
        <div onclick="switchIndexFrameGroup('index' , 0);" class="H-theme-font-color497bf0 index H-flex-item H-center-all H-text-align-center H-theme-font-color-999 H-touch-active  H-theme-font-colorff2a4c">
            <div>
                <span class="H-icon H-display-block H-line-height-normal"><i class="H-iconfont icon-shouyefill H-font-size-24"></i></span>
                <strong class="H-font-size-11 H-display-block H-font-weight-normal H-margin-vertical-bottom-2">影视</strong>
            </div>
        </div>
        <div onclick="switchIndexFrameGroup('music' , 1);" class="music H-flex-item H-center-all H-text-align-center H-theme-font-color-999 H-touch-active ">
            <div>
                <span class="H-icon H-display-block H-line-height-normal"><i class="H-iconfont H-icon-moban H-font-size-24"></i></span>
                <strong class="H-font-size-11 H-display-block H-font-weight-normal H-margin-vertical-bottom-2">音乐</strong>
            </div>
        </div>
        <div onclick="switchIndexFrameGroup('user' , 2);" class="user H-flex-item H-center-all H-text-align-center  H-theme-font-color-999 H-touch-active ">
            <div>
                <span class="H-icon H-display-block H-line-height-normal"><i class="H-iconfont H-icon-user H-font-size-24"></i></span>
                <strong class="H-font-size-11 H-display-block H-font-weight-normal H-margin-vertical-bottom-2">我的</strong>
            </div>
        </div>
    </footer>
    
</body>
<script type="text/javascript" src="./script/api.js"></script>
<script type="text/javascript" src="./script/jquery-1.12.0.min.js"></script>
<script type="text/javascript" src="./script/app.js"></script>


<script type="text/javascript">

	var sysconfig = "";//获取系统配置参数 , 参数内容在后台接口获取
	var frist_start = localStorage.getItem('frist_start'); //是否第一次启动APP 为1时代表 不是首次启动
	
	

//	 localStorage.setItem('token','045b62cd219a79a8e3adbc0cb586b726');
    apiready = function(){
    
        
    	sysconfig = $api.getStorage('sysconfig');
		api.parseTapmode();
		//监听闪屏广告结束,重新打开首页
		api.addEventListener({
	        name:'launch_end'
        },function(ret,err){
        	localStorage.setItem('frist_start' , 1 );
        	//初始化启动页
			openIndexFrameGroup();
        });
        
        api.addEventListener({
		    name:'viewappear'
		}, function(ret, err){        
		   getUser();
		});
		
		 api.addEventListener({
		    name:'get_user_info'
		}, function(ret, err){        
		   getUser();
		});

        
        //监听切换tab
        api.addEventListener({
	        name:'switchIndexFrameGroup'
        },function(ret,err){
        	
        	switchIndexFrameGroup(api.pageParam.name , api.pageParam.index);
        });
        //判断是否开启闪屏广告
        if(sysconfig && sysconfig.is_launch == true ){
        	//判断是否首次启动 ,首次启动则打开闪屏广告
			if( frist_start != 1 ){
				//打开闪屏广告页面
				$app.openWinByUrl('launch' , 'launch' );
			} else { 
				//初始化启动页
				openIndexFrameGroup();
			}
        } else {
        	//初始化启动页
			openIndexFrameGroup();
        }
        
//      bMap = api.require('bMap');
        
//      getUserLocation();

		api.setStatusBarStyle({
		    style: 'dark'
		});
		
		getUser();
    };
    
    //初始化启动页
    function openIndexFrameGroup(){
    
    	var header = $api.byId('index');
		$api.fixStatusBar(header); 
        var headerPos = $api.offset(header);
        var body_h = $api.offset($api.dom('body')).h;
		var $footer = $api.dom('footer');
		var footer_h = $api.offset($footer).h;
		var rect_h = body_h - headerPos.h - footer_h;
		api.openFrameGroup({
            name: 'group',
            scrollEnabled: false,
            rect: {x: 0, y: headerPos.h, w: headerPos.w, h: 'auto'  , 'marginBottom':footer_h},
            index: 0,
//          preload:0,
            frames: [
                {
                    name: 'home_body',
                    url: 'html/home_body.html'
                },
                {
                    name: 'music_body',
                    url: 'html/music_body.html'
                },
               
                {
                    name: 'user_body',
                    url: 'html/user_body.html'
                }
            ]
        }, function (ret, err) {
        });
    }
    
    /**
     * 切换frame组
     * @param name 切换tab id
     * @param index 切换索引 起始0
     */
    function switchIndexFrameGroup( name , index ){
    
    	var header = $api.byId(name);
		$api.fixStatusBar(header); 
		
    	//切换地步
    	$("footer div").removeClass('H-theme-font-color497bf0');
    	$("."+name ).addClass('H-theme-font-color497bf0');
    	//切换头部
    	$("header").removeClass('header-active');
    	$("#"+name ).addClass('header-active');
    	api.setFrameGroupIndex({
            name: 'group',
            index: index
        });
    }
    
    
    function setting(){
    	$app.openWinByUrl('setting' , 'html/setting' );
    }
    
    function xuqiu(){
    	token = localStorage.getItem('token');
    	if(typeof token =='undefined'  ||  token =='' || token == null ){
    		$app.openWinByUrl('login' , 'html/login');
    		return false;
    	}
    	
    	
    	$app.openWinByUrl('create_2_win_head' , 'html/win_head' ,{ 'furl':'create_2_body' , 'frame':'create_2_body' , 'title':'发布需求'});
    }
    
    $('#search').on('submit', function(e){
    	var keyword = $("#keyword").val();       
       
    	$app.openWinByUrl('so_list' , 'html/so_list' ,{ 'keyword':keyword , 'title':'搜索'});
    	return false;
    });
    
    function getUser(){
    	token = localStorage.getItem('token');
		
		var userinfo = $api.getStorage('userinfo');
		if(token !='' && token!=null  && typeof token !='undefined'){
			$app.ajax($app.serverUrl+"index/user/user_info",{
	    		'token':token 
	    	},'get',function(ret){
				if( ret.status == 1000){
					userinfo.portrait = ret.data.portrait;
					userinfo.nickname = ret.data.nickname;
					userinfo.vip_end_time = ret.data.vip_end_time;
					userinfo.vip = ret.data.vip;
					
					$api.setStorage('userinfo' , userinfo);
					localStorage.setItem('username',ret.data.nickname);
					localStorage.setItem('portrait',ret.data.portrait);
					
					api.sendEvent({
	                    name:'push_user_info'
                    });
                    
				} else {
					//$app.toast( ret.msg);
				}
			});
		}
    }
    
    
            //获取当前位置
    function getUserLocation(){
    	
       bMap.getLocation({
		    accuracy: '100m',
		    autoStop: true,
		    filter: 1
		}, function(ret, err) {
		    if (ret.status) {
		    	localStorage.setItem('lon' , ret.lon);
				localStorage.setItem('lat' , ret.lat);
				//根据地址选择经纬度
				bMap.getNameFromCoords({
				    lon: ret.lon,
    				lat: ret.lat
				}, function(ret, err) {
				    if (ret.status) {
				    	localStorage.setItem('city' , ret.city);
				    	localStorage.setItem('locationInfo' , ret.district + ret.streetName );
				    	$(".locationInfo").text( ret.district + ret.streetName );
				    	//保存当前位置信息
				        $api.setStorage('location',ret);
				    }
				});
				//刷新定位
				api.sendEvent({
	                name:'refresh_location'
                });
		    }
		});
    	
    }
</script>
</html>